import styled from "styled-components";

export const SearchBarContainer = styled.div`
  display: flex;
  justify-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.31);
  border: #000000 1px solid;
  border-radius: 60px;
  padding: 0.2rem 1rem;
  backdrop-filter: blur(10px);

  .searchButton {
    font-size: 1rem;
  }

  .searchInput {
    color:${props => props.theme.textColor} ;
    caret-color: #f5c761;
    ::placeholder {
      color: rgba(255, 255, 255, 0.63);
    }
  }
`
export const SearchBar = styled.div`

`